<html>
	<head>
		<title>历史数据统计</title>
		<link rel="stylesheet" href="lib/elementui/theme-chalk/index.css" type="text/css">
	</head>

	<body style="background-color: #e5e9f2;">
		<div id="hDataStat">
			<el-row :gutter="24">
				<el-col :span="24">
					<div class="grid-content1 bg-purple" id="fTotal"></div>
				</el-col>
			</el-row>
			<el-row :gutter="16">
				<el-col :span="8">
					<div class="grid-content2 bg-purple" id="street"></div>
				</el-col>
				<el-col :span="8">
					<div class="grid-content2 bg-purple" id="community"></div>
				</el-col>
				<el-col :span="8">
					<div class="grid-content2 bg-purple" id="person"></div>
				</el-col>
			</el-row>
		</div>

		<style>
		  .el-row {
		    margin-bottom: 20px;
		    &:last-child {
		      margin-bottom: 0;
		    }
		  }
		  .el-col {
		    border-radius: 4px;
		  }
		  .bg-purple {
		    background: #ffffff;
		  }
		  /* .bg-purple{
		    background: #e5e9f2;
		  } */
		  .grid-content1 {
		    border-radius: 4px;
		    min-height: 52%;
		  }
		  .grid-content2 {
		    border-radius: 4px;
		    min-height: 43%;
		  }
		  .row-bg {
		    padding: 10px 0;
		    background-color: #f9fafc;
		  }
		</style>
		<!-- 引入组件库 -->
		<script type="text/javascript" src="lib/vue.js"></script>
		<script type="text/javascript" src="lib/elementui/index.js"></script>
		<script type="text/javascript" src="lib/jquery.js"></script>
		<script type="text/javascript" src="lib/echarts.min.js"></script>
		<script type="text/javascript" src="lib/axios.min.js"></script>
		<script type="text/javascript">
			new Vue({
				el: '#hDataStat',
				mounted() {
				}
			});
		</script>
	</body>

</html>
